<!DOCTYPE html>
<html lang=zh>
<head>
  <meta charset="utf-8">
  
  <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
  <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, minimum-scale=1, user-scalable=no, minimal-ui">
  <meta name="renderer" content="webkit">
  <meta http-equiv="Cache-Control" content="no-transform" />
  <meta http-equiv="Cache-Control" content="no-siteapp" />
  <meta name="apple-mobile-web-app-capable" content="yes">
  <meta name="apple-mobile-web-app-status-bar-style" content="black">
  <meta name="format-detection" content="telephone=no,email=no,adress=no">
  <!-- Color theme for statusbar -->
  <meta name="theme-color" content="#000000" />
  <!-- 强制页面在当前窗口以独立页面显示,防止别人在框架里调用页面 -->
  <meta http-equiv="window-target" content="_top" />
  
  
  <title>正则表达式归纳 | 雨落</title>
  <meta name="description" content="基础知识 \：将下一个字符标记为特殊字符  123456789&#x2F;*例如：    \n：匹配一个换行符    \\：匹配一个 \    \(：匹配一个 (    等等等*&#x2F;&amp;#x27;&lt;span&gt;&amp;#x27;.match(&#x2F;\&lt;span\&gt;&#x2F;) &#x2F;&#x2F; 结果：[&amp;#x27;&lt;span&gt;&amp;#x27;]   ^：以某个字符开头  123&#x2F;&#x2F; 以 1 开头&#x2F;^1&#x2F;.tes">
<meta property="og:type" content="article">
<meta property="og:title" content="正则表达式归纳">
<meta property="og:url" content="https://gitee.com/Yu-Luoboke/2021/11/26/%E6%AD%A3%E5%88%99%E8%A1%A8%E8%BE%BE%E5%BC%8F%E5%BD%92%E7%BA%B3/index.html">
<meta property="og:site_name" content="雨落">
<meta property="og:description" content="基础知识 \：将下一个字符标记为特殊字符  123456789&#x2F;*例如：    \n：匹配一个换行符    \\：匹配一个 \    \(：匹配一个 (    等等等*&#x2F;&amp;#x27;&lt;span&gt;&amp;#x27;.match(&#x2F;\&lt;span\&gt;&#x2F;) &#x2F;&#x2F; 结果：[&amp;#x27;&lt;span&gt;&amp;#x27;]   ^：以某个字符开头  123&#x2F;&#x2F; 以 1 开头&#x2F;^1&#x2F;.tes">
<meta property="og:locale" content="zh_CN">
<meta property="article:published_time" content="2021-11-26T02:06:25.000Z">
<meta property="article:modified_time" content="2021-11-30T03:26:50.197Z">
<meta property="article:author" content="lianghongming">
<meta name="twitter:card" content="summary">
  <!-- Canonical links -->
  <link rel="canonical" href="https://gitee.com/Yu-Luoboke/2021/11/26/%E6%AD%A3%E5%88%99%E8%A1%A8%E8%BE%BE%E5%BC%8F%E5%BD%92%E7%BA%B3/index.html">
  
    <link rel="alternate" href="/atom.xml" title="雨落" type="application/atom+xml">
  
  
    <link rel="icon" href="/favicon.png" type="image/x-icon">
  
  
<link rel="stylesheet" href="/blog/css/style.css">

  
  
  
  
<meta name="generator" content="Hexo 5.2.0"></head>


<body class="main-center" itemscope itemtype="http://schema.org/WebPage">
  <header class="header" itemscope itemtype="http://schema.org/WPHeader">
  <div class="slimContent">
    <div class="navbar-header">
      
      
      <div class="profile-block text-center">
        <a id="avatar" href="http://yu-luoboke.gitee.io/blog" target="_blank">
          <img class="img-circle img-rotate" src="/blog/images/avatar.jpg" width="200" height="200">
        </a>
        <h2 id="name" class="hidden-xs hidden-sm">雨落</h2>
        <h3 id="title" class="hidden-xs hidden-sm hidden-md">前端开发-奋斗青年</h3>
        <small id="location" class="text-muted hidden-xs hidden-sm"><i class="icon icon-map-marker"></i> GuangZhou, China</small>
      </div>
      
      <div class="search" id="search-form-wrap">

    <form class="search-form sidebar-form">
        <div class="input-group">
            <input type="text" class="search-form-input form-control" placeholder="搜索" />
            <span class="input-group-btn">
                <button type="submit" class="search-form-submit btn btn-flat" onclick="return false;"><i class="icon icon-search"></i></button>
            </span>
        </div>
    </form>
    <div class="ins-search">
  <div class="ins-search-mask"></div>
  <div class="ins-search-container">
    <div class="ins-input-wrapper">
      <input type="text" class="ins-search-input" placeholder="想要查找什么..." x-webkit-speech />
      <button type="button" class="close ins-close ins-selectable" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">×</span></button>
    </div>
    <div class="ins-section-wrapper">
      <div class="ins-section-container"></div>
    </div>
  </div>
</div>


</div>
      <button class="navbar-toggle collapsed" type="button" data-toggle="collapse" data-target="#main-navbar" aria-controls="main-navbar" aria-expanded="false">
        <span class="sr-only">Toggle navigation</span>
        <span class="icon-bar"></span>
        <span class="icon-bar"></span>
        <span class="icon-bar"></span>
      </button>
    </div>
    <nav id="main-navbar" class="collapse navbar-collapse" itemscope itemtype="http://schema.org/SiteNavigationElement" role="navigation">
      <ul class="nav navbar-nav main-nav menu-highlight">
        
        
        <li class="menu-item menu-item-home">
          <a href="/blog/.">
            
            <i class="icon icon-home-fill"></i>
            
            <span class="menu-title">首页</span>
          </a>
        </li>
        
        
        <li class="menu-item menu-item-archives">
          <a href="/blog/archives">
            
            <i class="icon icon-archives-fill"></i>
            
            <span class="menu-title">归档</span>
          </a>
        </li>
        
        
        <li class="menu-item menu-item-categories">
          <a href="/blog/categories">
            
            <i class="icon icon-folder"></i>
            
            <span class="menu-title">分类</span>
          </a>
        </li>
        
        
        <li class="menu-item menu-item-tags">
          <a href="/blog/tags">
            
            <i class="icon icon-tags"></i>
            
            <span class="menu-title">标签</span>
          </a>
        </li>
        
      </ul>
      
	
    <ul class="social-links">
    	
        <li><a href="http://yu-luoboke.gitee.io/blog" target="_blank" title="Github" ><i class="icon icon-github"></i></a></li>
        
    </ul>

    </nav>
  </div>
</header>

  
    <aside class="sidebar" itemscope itemtype="http://schema.org/WPSideBar">
  <div class="slimContent">
    
      <div class="widget">
    <h3 class="widget-title">公告</h3>
    <div class="widget-body">
        <div id="board">
            <div class="content">
                <p>欢迎交流与分享经验!</p>
            </div>
        </div>
    </div>
</div>

    
      
  <div class="widget">
    <h3 class="widget-title">分类</h3>
    <div class="widget-body">
      <ul class="category-list"><li class="category-list-item"><a class="category-list-link" href="/blog/categories/Git/">Git</a><span class="category-list-count">1</span></li><li class="category-list-item"><a class="category-list-link" href="/blog/categories/HTML-CSS/">HTML + CSS</a><span class="category-list-count">7</span></li><li class="category-list-item"><a class="category-list-link" href="/blog/categories/JVM%EF%BC%88Java%E8%99%9A%E6%8B%9F%E6%9C%BA%EF%BC%89-%E5%9E%83%E5%9C%BE%E5%9B%9E%E6%94%B6%E7%AE%97%E6%B3%95/">JVM（Java虚拟机）-垃圾回收算法</a><span class="category-list-count">1</span></li><li class="category-list-item"><a class="category-list-link" href="/blog/categories/Node/">Node</a><span class="category-list-count">1</span></li><li class="category-list-item"><a class="category-list-link" href="/blog/categories/Project/">Project</a><span class="category-list-count">1</span></li><li class="category-list-item"><a class="category-list-link" href="/blog/categories/React/">React</a><span class="category-list-count">4</span></li><li class="category-list-item"><a class="category-list-link" href="/blog/categories/SVN/">SVN</a><span class="category-list-count">1</span></li><li class="category-list-item"><a class="category-list-link" href="/blog/categories/Vue-typescript/">Vue-typescript</a><span class="category-list-count">1</span></li><li class="category-list-item"><a class="category-list-link" href="/blog/categories/gitee/">gitee</a><span class="category-list-count">1</span></li><li class="category-list-item"><a class="category-list-link" href="/blog/categories/iOS/">iOS</a><span class="category-list-count">1</span></li><li class="category-list-item"><a class="category-list-link" href="/blog/categories/js/">js</a><span class="category-list-count">12</span></li><li class="category-list-item"><a class="category-list-link" href="/blog/categories/vue/">vue</a><span class="category-list-count">13</span></li><li class="category-list-item"><a class="category-list-link" href="/blog/categories/web-serve%E9%9D%99%E6%80%81%E8%B5%84%E6%BA%90%E6%9C%8D%E5%8A%A1%E5%99%A8/">web serve静态资源服务器</a><span class="category-list-count">1</span></li><li class="category-list-item"><a class="category-list-link" href="/blog/categories/webpack/">webpack</a><span class="category-list-count">1</span></li><li class="category-list-item"><a class="category-list-link" href="/blog/categories/%E5%89%8D%E7%AB%AF%E8%87%AA%E5%8A%A8%E5%8C%96/">前端自动化</a><span class="category-list-count">1</span></li><li class="category-list-item"><a class="category-list-link" href="/blog/categories/%E5%B0%8F%E7%A8%8B%E5%BA%8F/">小程序</a><span class="category-list-count">1</span></li><li class="category-list-item"><a class="category-list-link" href="/blog/categories/%E7%A7%BB%E5%8A%A8%E7%AB%AF/">移动端</a><span class="category-list-count">1</span></li><li class="category-list-item"><a class="category-list-link" href="/blog/categories/%E7%BB%8F%E9%AA%8C/">经验</a><span class="category-list-count">1</span></li><li class="category-list-item"><a class="category-list-link" href="/blog/categories/%E9%9D%A2%E8%AF%95%E9%A2%98/">面试题</a><span class="category-list-count">4</span></li></ul>
    </div>
  </div>


    
      

    
      
    
      
  <div class="widget">
    <h3 class="widget-title">归档</h3>
    <div class="widget-body">
      <ul class="archive-list"><li class="archive-list-item"><a class="archive-list-link" href="/blog/archives/2024/04/">四月 2024</a><span class="archive-list-count">1</span></li><li class="archive-list-item"><a class="archive-list-link" href="/blog/archives/2023/11/">十一月 2023</a><span class="archive-list-count">8</span></li><li class="archive-list-item"><a class="archive-list-link" href="/blog/archives/2023/09/">九月 2023</a><span class="archive-list-count">1</span></li><li class="archive-list-item"><a class="archive-list-link" href="/blog/archives/2022/12/">十二月 2022</a><span class="archive-list-count">1</span></li><li class="archive-list-item"><a class="archive-list-link" href="/blog/archives/2022/08/">八月 2022</a><span class="archive-list-count">3</span></li><li class="archive-list-item"><a class="archive-list-link" href="/blog/archives/2022/07/">七月 2022</a><span class="archive-list-count">1</span></li><li class="archive-list-item"><a class="archive-list-link" href="/blog/archives/2022/06/">六月 2022</a><span class="archive-list-count">4</span></li><li class="archive-list-item"><a class="archive-list-link" href="/blog/archives/2022/04/">四月 2022</a><span class="archive-list-count">1</span></li><li class="archive-list-item"><a class="archive-list-link" href="/blog/archives/2022/01/">一月 2022</a><span class="archive-list-count">1</span></li><li class="archive-list-item"><a class="archive-list-link" href="/blog/archives/2021/12/">十二月 2021</a><span class="archive-list-count">4</span></li><li class="archive-list-item"><a class="archive-list-link" href="/blog/archives/2021/11/">十一月 2021</a><span class="archive-list-count">3</span></li><li class="archive-list-item"><a class="archive-list-link" href="/blog/archives/2021/10/">十月 2021</a><span class="archive-list-count">1</span></li><li class="archive-list-item"><a class="archive-list-link" href="/blog/archives/2021/04/">四月 2021</a><span class="archive-list-count">1</span></li><li class="archive-list-item"><a class="archive-list-link" href="/blog/archives/2021/03/">三月 2021</a><span class="archive-list-count">3</span></li><li class="archive-list-item"><a class="archive-list-link" href="/blog/archives/2021/02/">二月 2021</a><span class="archive-list-count">1</span></li><li class="archive-list-item"><a class="archive-list-link" href="/blog/archives/2021/01/">一月 2021</a><span class="archive-list-count">6</span></li><li class="archive-list-item"><a class="archive-list-link" href="/blog/archives/2020/12/">十二月 2020</a><span class="archive-list-count">15</span></li></ul>
    </div>
  </div>


    
      
  <div class="widget">
    <h3 class="widget-title">最新文章</h3>
    <div class="widget-body">
      <ul class="recent-post-list list-unstyled no-thumbnail">
        
          <li>
            
            <div class="item-inner">
              <p class="item-category">
                <a class="category-link" href="/blog/categories/HTML-CSS/">HTML + CSS</a>
              </p>
              <p class="item-title">
                <a href="/blog/2024/04/15/%E6%8B%96%E5%8A%A8%E5%92%8C%E7%82%B9%E5%87%BB%E5%BC%B9%E7%AA%97/" class="title">拖动和点击弹窗</a>
              </p>
              <p class="item-date">
                <time datetime="2024-04-15T12:22:06.000Z" itemprop="datePublished">2024-04-15</time>
              </p>
            </div>
          </li>
          
          <li>
            
            <div class="item-inner">
              <p class="item-category">
                <a class="category-link" href="/blog/categories/%E9%9D%A2%E8%AF%95%E9%A2%98/">面试题</a>
              </p>
              <p class="item-title">
                <a href="/blog/2023/11/29/html%E9%9D%A2%E8%AF%95%E9%A2%98/" class="title">html面试题</a>
              </p>
              <p class="item-date">
                <time datetime="2023-11-29T15:58:27.000Z" itemprop="datePublished">2023-11-29</time>
              </p>
            </div>
          </li>
          
          <li>
            
            <div class="item-inner">
              <p class="item-category">
                <a class="category-link" href="/blog/categories/%E9%9D%A2%E8%AF%95%E9%A2%98/">面试题</a>
              </p>
              <p class="item-title">
                <a href="/blog/2023/11/29/css%E9%9D%A2%E8%AF%95%E9%A2%98/" class="title">css面试题</a>
              </p>
              <p class="item-date">
                <time datetime="2023-11-29T15:57:17.000Z" itemprop="datePublished">2023-11-29</time>
              </p>
            </div>
          </li>
          
          <li>
            
            <div class="item-inner">
              <p class="item-category">
                <a class="category-link" href="/blog/categories/%E9%9D%A2%E8%AF%95%E9%A2%98/">面试题</a>
              </p>
              <p class="item-title">
                <a href="/blog/2023/11/29/js%E9%9D%A2%E8%AF%95%E9%A2%98/" class="title">js面试题</a>
              </p>
              <p class="item-date">
                <time datetime="2023-11-29T15:37:30.000Z" itemprop="datePublished">2023-11-29</time>
              </p>
            </div>
          </li>
          
          <li>
            
            <div class="item-inner">
              <p class="item-category">
                <a class="category-link" href="/blog/categories/%E9%9D%A2%E8%AF%95%E9%A2%98/">面试题</a>
              </p>
              <p class="item-title">
                <a href="/blog/2023/11/29/%E9%9D%A2%E8%AF%95%E9%A2%98/" class="title">面试题</a>
              </p>
              <p class="item-date">
                <time datetime="2023-11-29T15:29:49.000Z" itemprop="datePublished">2023-11-29</time>
              </p>
            </div>
          </li>
          
      </ul>
    </div>
  </div>
  

    
  </div>
</aside>

  
  
<main class="main" role="main">
  <div class="content">
  <article id="post-正则表达式归纳" class="article article-type-post" itemscope itemtype="http://schema.org/BlogPosting">
    
    <div class="article-header">
      
        
  
    <h1 class="article-title" itemprop="name">
      正则表达式归纳
    </h1>
  

      
      <div class="article-meta">
        <span class="article-date">
    <i class="icon icon-calendar-check"></i>
	<a href="/blog/2021/11/26/%E6%AD%A3%E5%88%99%E8%A1%A8%E8%BE%BE%E5%BC%8F%E5%BD%92%E7%BA%B3/" class="article-date">
	  <time datetime="2021-11-26T02:06:25.000Z" itemprop="datePublished">2021-11-26</time>
	</a>
</span>
        
  <span class="article-category">
    <i class="icon icon-folder"></i>
    <a class="article-category-link" href="/blog/categories/js/">js</a>
  </span>

        

        

        <span class="post-comment"><i class="icon icon-comment"></i> <a href="/blog/2021/11/26/%E6%AD%A3%E5%88%99%E8%A1%A8%E8%BE%BE%E5%BC%8F%E5%BD%92%E7%BA%B3/#comments" class="article-comment-link">评论</a></span>
        
      </div>
    </div>
    <div class="article-entry marked-body" itemprop="articleBody">
      
        <h2 id="基础知识"><a href="#基础知识" class="headerlink" title="基础知识"></a>基础知识</h2><ul>
<li>\：将下一个字符标记为特殊字符</li>
</ul>
<figure class="highlight js"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br></pre></td><td class="code"><pre><span class="line"><span class="comment">/*</span></span><br><span class="line"><span class="comment">例如：</span></span><br><span class="line"><span class="comment">    \n：匹配一个换行符</span></span><br><span class="line"><span class="comment">    \\：匹配一个 \</span></span><br><span class="line"><span class="comment">    \(：匹配一个 (</span></span><br><span class="line"><span class="comment">    等等等</span></span><br><span class="line"><span class="comment"></span></span><br><span class="line"><span class="comment">*/</span></span><br><span class="line"><span class="string">&#x27;&lt;span&gt;&#x27;</span>.match(<span class="regexp">/\&lt;span\&gt;/</span>) <span class="comment">// 结果：[&#x27;&lt;span&gt;&#x27;]</span></span><br></pre></td></tr></table></figure>

<ul>
<li>^：以某个字符开头</li>
</ul>
<figure class="highlight js"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br></pre></td><td class="code"><pre><span class="line"><span class="comment">// 以 1 开头</span></span><br><span class="line">/^<span class="number">1</span>/.test(<span class="string">&#x27;123456&#x27;</span>) <span class="comment">// true</span></span><br><span class="line">/^<span class="number">1</span>/.test(<span class="string">&#x27;23456&#x27;</span>)  <span class="comment">// false</span></span><br></pre></td></tr></table></figure>


<ul>
<li>$：以某个字符结尾</li>
</ul>
<figure class="highlight js"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br></pre></td><td class="code"><pre><span class="line"><span class="comment">// 以 6 结尾</span></span><br><span class="line">/<span class="number">6</span>$/.test(<span class="number">123456</span>) <span class="comment">// true</span></span><br><span class="line">/<span class="number">5</span>$/.test(<span class="number">123456</span>) <span class="comment">// false</span></span><br></pre></td></tr></table></figure>


<ul>
<li>^ 和 $ 结合使用</li>
</ul>
<figure class="highlight js"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br></pre></td><td class="code"><pre><span class="line"><span class="comment">// 判断字符串是否全是数字，并且以数字开始，数字结尾</span></span><br><span class="line"><span class="comment">// + 的意思是：匹配多个数字</span></span><br><span class="line">/^\d+\d$/.test(<span class="string">&#x27;123456&#x27;</span>) <span class="comment">// true</span></span><br><span class="line">/^\d+\d$/.test(<span class="string">&#x27;1234dddd56&#x27;</span>) <span class="comment">// false</span></span><br></pre></td></tr></table></figure>


<ul>
<li>+：匹配前面的子表达式一次或者多次</li>
</ul>
<figure class="highlight js"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br></pre></td><td class="code"><pre><span class="line"><span class="comment">// 默认是只匹配1次，如：&#x27;123456&#x27;.match(/[1-9]/)，结果是[1]，加上 + 就会匹配1次或者多次：&#x27;123456&#x27;.match(/[1-9]+/)，结果是[123456]</span></span><br><span class="line">/^\d+\d$/.test(<span class="string">&#x27;123456&#x27;</span>) <span class="comment">// 匹配多个数字</span></span><br><span class="line"><span class="string">&#x27;1111123456&#x27;</span>.match(<span class="regexp">/1+/</span>) <span class="comment">// [11111]</span></span><br></pre></td></tr></table></figure>


<ul>
<li>*：匹配前面的子表达式零次或者多次</li>
</ul>
<figure class="highlight js"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br></pre></td><td class="code"><pre><span class="line"><span class="comment">// 默认是只匹配1次，如：&#x27;123456&#x27;.match(/[1-9]/)，结果是[1]，加上 * 就会匹配0次或者多次：&#x27;123456&#x27;.match(/[1-9]+/)，结果是[123456]</span></span><br><span class="line">/^\d*\d$/.test(<span class="string">&#x27;123456&#x27;</span>) <span class="comment">// true</span></span><br><span class="line">/^\d*\d$/.test(<span class="string">&#x27;12d3456&#x27;</span>) <span class="comment">// false</span></span><br></pre></td></tr></table></figure>


<ul>
<li>?：匹配前面的子表达式零次或者一次</li>
</ul>
<figure class="highlight js"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br></pre></td><td class="code"><pre><span class="line">/^\d?<span class="regexp">/.test(&#x27;fdsafsdfadsfsaf&#x27;) /</span><span class="regexp">/ true 在 \d等后面加 ?，即表示惰性的，即这里将会匹配到0次，所以无论字符串是什么，结果都为 true</span></span><br><span class="line"><span class="regexp">/</span>^\d.?<span class="regexp">/.test(&#x27;1fdsafsdfadsfsaf&#x27;) /</span><span class="regexp">/ true ：以数字开头，&quot;.&quot; 代表的意思是除了\n外的任意字符，后面加了 ?, 则表示该正则表达式为惰性的，最终的意思是：以数字开头，并且数字只匹配一次，数字后面的字符随意，所以结果为 true</span></span><br></pre></td></tr></table></figure>


<ul>
<li>{n}：n是一个非负整数，匹配确定的n次，即n代表连续匹配到的次数（连续匹配针对的指定字符，如 1， a，b 等等，\d 这种类型的话就不会要求连续）</li>
</ul>
<figure class="highlight js"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br></pre></td><td class="code"><pre><span class="line">/<span class="number">1</span>&#123;<span class="number">2</span>&#125;/.test(<span class="string">&#x27;21123456123&#x27;</span>) <span class="comment">// true n=2，即代表1要被连续匹配两次，结果才为 true，这里是1连续出现了2两次，所结果为 true</span></span><br><span class="line">/<span class="number">1</span>&#123;<span class="number">2</span>&#125;/.test(<span class="string">&#x27;214123456123&#x27;</span>) <span class="comment">// false 没有连续2次匹配到1，所以结果为false</span></span><br><span class="line"></span><br><span class="line"><span class="string">&#x27;2111113333&#x27;</span>.match(<span class="regexp">/1&#123;2&#125;/</span>) <span class="comment">// [11] 确定匹配2次，所以结果是 [11]</span></span><br></pre></td></tr></table></figure>


<ul>
<li>{n,}：n是一个非负整数，至少连续匹配 n 次，这个 n 次指的是连续的匹配（连续匹配针对的指定字符，如 1， a，b 等等，\d 这种类型的话就不会要求连续）</li>
</ul>
<figure class="highlight js"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br></pre></td><td class="code"><pre><span class="line">/<span class="number">1</span>&#123;<span class="number">2</span>,&#125;/.test(<span class="string">&#x27;d11ds&#x27;</span>) <span class="comment">// true  2代表至少匹配2次，这里的 1 连续出现了 2 次，所以结果为true</span></span><br><span class="line">/<span class="number">1</span>&#123;<span class="number">2</span>,&#125;/.test(<span class="string">&#x27;d1a1ds&#x27;</span>) <span class="comment">// false  没有连续2次匹配到 1，所以结果为 false</span></span><br><span class="line"></span><br><span class="line"><span class="string">&#x27;2111113333&#x27;</span>.match(<span class="regexp">/1&#123;2,&#125;/</span>) <span class="comment">// [11111]  至少匹配 2 次，但是这里的 1 连续出现了 5 次，所以结果为 [11111]</span></span><br><span class="line"><span class="string">&#x27;21113455113333&#x27;</span>.match(<span class="regexp">/1&#123;2,&#125;/</span>) <span class="comment">// [111] 至少匹配 2 次，但是这里的 1 连续出现了 3 次，所以结果是 [111]</span></span><br></pre></td></tr></table></figure>


<ul>
<li>{n,m}：n 和 m 为非负整数，n &lt;= m，最少连续匹配 n 次，最多连续匹配 m 次（连续匹配针对的指定字符，如 1， a，b 等等，\d 这种类型的话就不会要求连续）</li>
</ul>
<figure class="highlight js"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br></pre></td><td class="code"><pre><span class="line">/<span class="number">3</span>&#123;<span class="number">1</span>,<span class="number">3</span>&#125;/.test(<span class="string">&#x27;123&#x27;</span>) <span class="comment">// true</span></span><br><span class="line">/<span class="number">3</span>&#123;<span class="number">1</span>,<span class="number">3</span>&#125;/.test(<span class="string">&#x27;12333333&#x27;</span>) <span class="comment">// true</span></span><br><span class="line"></span><br><span class="line"><span class="string">&#x27;123333&#x27;</span>.match(<span class="regexp">/3&#123;1,3&#125;/</span>) <span class="comment">// [333]</span></span><br></pre></td></tr></table></figure>


<ul>
<li>?：当该字符紧跟在任何一个其他限制符（*,+,?，{n}，{n,}，{n,m}）后面时，匹配模式是非贪婪的。非贪婪模式尽可能少的匹配所搜索的字符串，而默认的贪婪模式则尽可能多的匹配所搜索的字符串。例如，对于字符串“oooo”，“o+?”将匹配单个“o”，而“o+”将匹配所有“o”</li>
</ul>
<figure class="highlight js"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br></pre></td><td class="code"><pre><span class="line"><span class="comment">// 开启惰性模式：什么是惰性模式，惰性模式就是指匹配次数越少越好，能不执行，尽量不执行，能执行 0 次，坚决不执行 1次</span></span><br><span class="line"></span><br><span class="line"><span class="string">&#x27;122345678&#x27;</span>.match(<span class="regexp">/2*?/</span>) <span class="comment">// [] 开启惰性匹配，* 指的是：匹配0次或者多次，因为是惰性模式，肯定是只执行 0 次，所以结果为空</span></span><br><span class="line"></span><br><span class="line"><span class="string">&#x27;122345678&#x27;</span>.match(<span class="regexp">/2+?/</span>) <span class="comment">// [2] + :表示匹配一次或者多次，开启惰性模式，所以只会匹配一次</span></span><br></pre></td></tr></table></figure>


<ul>
<li>“.”：    匹配除“\n”之外的任何单个字符。要匹配包括“\n”在内的任何字符，请使用像“(.|\n)”的模式</li>
</ul>
<ul>
<li>(pattern)：匹配pattern并获取这一匹配。所获取的匹配可以从产生的Matches集合得到，在VBScript中使用SubMatches集合，在JScript中则使用$0…$9属性。要匹配圆括号字符，请使用“(”或“)”.理解：将表达式置于括号内，就将他们形成了组，组的作用是将他们用为一个整体来使用正则操作，比如重复操作</li>
</ul>
<figure class="highlight js"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br><span class="line">12</span><br><span class="line">13</span><br><span class="line">14</span><br></pre></td><td class="code"><pre><span class="line"><span class="comment">// () 的意思就是分组匹配</span></span><br><span class="line"><span class="string">&#x27;1234&#x27;</span>.match(<span class="regexp">/(12)/</span>)[<span class="number">0</span>] <span class="comment">// 12</span></span><br><span class="line">/(<span class="number">12</span>)/.test(<span class="string">&#x27;132234&#x27;</span>) <span class="comment">// false</span></span><br><span class="line">/(<span class="number">12</span>)/.test(<span class="string">&#x27;12234&#x27;</span>) <span class="comment">// true</span></span><br><span class="line">/^([<span class="number">1</span>-<span class="number">9</span>][<span class="number">0</span>-<span class="number">9</span>]*)+(\.[<span class="number">0</span>-<span class="number">9</span>]&#123;<span class="number">1</span>,<span class="number">2</span>&#125;)?$/.test(<span class="string">&#x27;122103.09&#x27;</span>) <span class="comment">// 非零开头的最多带两位小数的数字</span></span><br><span class="line"></span><br><span class="line"><span class="comment">// 在JScript中则使用$0…$9属性的意思是：分别获取第一个(pattern)到第九个(pattern)里面的值</span></span><br><span class="line"><span class="string">&#x27;123456123678123888&#x27;</span>.replace(<span class="regexp">/(123)/g</span>,<span class="string">&quot;&lt;p&gt;&#x27;$1&#x27;&lt;/p&gt;&quot;</span>)</span><br><span class="line"><span class="comment">// 结果：&quot;&lt;p&gt;&#x27;123&#x27;&lt;/p&gt;456&lt;p&gt;&#x27;123&#x27;&lt;/p&gt;678&lt;p&gt;&#x27;123&#x27;&lt;/p&gt;888&quot;</span></span><br><span class="line"><span class="comment">// $1：指的是第一个(pattern)的pattern的值，即 $1 === 123</span></span><br><span class="line"></span><br><span class="line"><span class="string">&#x27;123456123678123888&#x27;</span>.replace(<span class="regexp">/(123)|(888)/g</span>,<span class="string">&quot;&lt;p&gt;&#x27;$2&#x27;&lt;/p&gt;&quot;</span>)</span><br><span class="line"><span class="comment">// 结果是：&quot;&lt;p&gt;&#x27;&#x27;&lt;/p&gt;456&lt;p&gt;&#x27;&#x27;&lt;/p&gt;678&lt;p&gt;&#x27;&#x27;&lt;/p&gt;&lt;p&gt;&#x27;888&#x27;&lt;/p&gt;&quot;</span></span><br><span class="line"><span class="comment">// $2：指的是第二个(pattern)的pattern的值，即 $2 === 888</span></span><br></pre></td></tr></table></figure>

<ul>
<li>(?:pattern)：根据字符串的不同，动态匹配不同的 pattern</li>
</ul>
<figure class="highlight js"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br></pre></td><td class="code"><pre><span class="line"><span class="string">&#x27;window&#x27;</span>.match(<span class="regexp">/win(?:dow|day)/</span>) <span class="comment">// [&#x27;window&#x27;]</span></span><br><span class="line"><span class="string">&#x27;winday&#x27;</span>.match(<span class="regexp">/win(?:dow|day)/</span>) <span class="comment">// [&#x27;winday&#x27;]</span></span><br></pre></td></tr></table></figure>


<ul>
<li>(?=pattern)：正向肯定预查<span style="color: red">(正向指：字符写在前面：/window(?=95|2–)/)</span>，在任何匹配pattern的字符串开始处匹配查找字符串。这是一个非获取匹配，也就是说，该匹配不需要获取供以后使用。例如，“Windows(?=95|98|NT|2000)”能匹配“Windows2000”中的“Windows”，但不能匹配“Windows3.1”中的“Windows”。预查不消耗字符，也就是说，在一个匹配发生后，在最后一次匹配之后立即开始下一次匹配的搜索，而不是从包含预查的字符之后开始。</li>
</ul>
<figure class="highlight js"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br><span class="line">12</span><br><span class="line">13</span><br><span class="line">14</span><br><span class="line">15</span><br></pre></td><td class="code"><pre><span class="line"><span class="string">&#x27;window95&#x27;</span>.match(<span class="regexp">/window(?=95|2000)/</span>) <span class="comment">// 能匹配到 window95 的 window</span></span><br><span class="line"><span class="string">&#x27;123window95&#x27;</span>.match(<span class="regexp">/window(?=95|2000)/</span>) <span class="comment">// 能匹配到 window</span></span><br><span class="line"><span class="string">&#x27;window-95&#x27;</span>.match(<span class="regexp">/window(?=95|2000)/</span>) <span class="comment">// 无法匹配到 window</span></span><br><span class="line"></span><br><span class="line"><span class="comment">/*</span></span><br><span class="line"><span class="comment">总结：(?=pattern)：正向肯定预查，就是指字符 pattern 前面是否包含某个字符</span></span><br><span class="line"><span class="comment">如下例子：pattern的值可以是95也可以是2000，/window(?=95|2000)/的意思是，匹配95或者2000前面的window字符</span></span><br><span class="line"><span class="comment"></span></span><br><span class="line"><span class="comment">正向预查：匹配的字符（window）需要写在(?=pattern)前面</span></span><br><span class="line"><span class="comment">&#x27;window95&#x27;.match(/window(?=95|2000)/)：95前面是window字符，所以可以匹配到 window</span></span><br><span class="line"><span class="comment"></span></span><br><span class="line"><span class="comment">&#x27;123window95&#x27;.match(/window(?=95|2000)/)：95前面也是window字符，所以可以匹配到window</span></span><br><span class="line"><span class="comment"></span></span><br><span class="line"><span class="comment">&#x27;window-95&#x27;.match(/window(?=95|2000)/)：95前面是 - ，所以无法匹配到window</span></span><br><span class="line"><span class="comment">*/</span></span><br></pre></td></tr></table></figure>

<ul>
<li>(?!pattern)：正向否定预查，即正向不查找 pattern 字符</li>
</ul>
<figure class="highlight js"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br></pre></td><td class="code"><pre><span class="line"><span class="string">&#x27;window1000&#x27;</span>.match(<span class="regexp">/window(?!95|2000)/</span>) <span class="comment">// [&#x27;window&#x27;]</span></span><br><span class="line"><span class="string">&#x27;window2000&#x27;</span>.match(<span class="regexp">/window(?!95|2000)/</span>) <span class="comment">// null</span></span><br></pre></td></tr></table></figure>


<ul>
<li>(?&lt;=pattern)：反向肯定预查<span style="color: red">(反向指：字符写在后面，/(?&lt;=95|2000&gt;)window/)</span>，与正向肯定预查类拟，只是方向相反。例如，“(?&lt;=95|98|NT|2000)Windows”能匹配“2000Windows”中的“Windows”，但不能匹配“3.1Windows”中的“Windows”</li>
</ul>
<figure class="highlight js"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br></pre></td><td class="code"><pre><span class="line"><span class="string">&#x27;95window&#x27;</span>.match(<span class="regexp">/(?&lt;=95|2000)window/</span>) <span class="comment">// 能匹配到 window</span></span><br><span class="line"><span class="string">&#x27;95window1111&#x27;</span>.match(<span class="regexp">/(?&lt;=95|2000)window/</span>) <span class="comment">// 能匹配到 window</span></span><br><span class="line"><span class="string">&#x27;95-window&#x27;</span>.match(<span class="regexp">/(?&lt;=95|2000)window/</span>) <span class="comment">// 无法匹配到 window</span></span><br><span class="line"></span><br><span class="line"><span class="comment">// 总结：(?&lt;=pattern) 的后面(也就是95或者2000的后面)是window字符，则匹配成功</span></span><br></pre></td></tr></table></figure>

<ul>
<li>(?&lt;!pattern)：反向否定预查，与正向否定预查类拟，只是方向相反</li>
</ul>
<figure class="highlight js"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br></pre></td><td class="code"><pre><span class="line"><span class="string">&#x27;1000window&#x27;</span>.match(<span class="regexp">/(?&lt;!95|2000)window/</span>) <span class="comment">// [&#x27;window&#x27;]</span></span><br><span class="line"><span class="string">&#x27;2000window&#x27;</span>.match(<span class="regexp">/(?&lt;!95|2000)window/</span>) <span class="comment">// null</span></span><br></pre></td></tr></table></figure>

<ul>
<li>x|y：匹配x或y</li>
</ul>
<figure class="highlight js"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br></pre></td><td class="code"><pre><span class="line"><span class="string">&#x27;123456&#x27;</span>.match(<span class="regexp">/123|456/</span>) <span class="comment">// [&#x27;123&#x27;]</span></span><br><span class="line"><span class="string">&#x27;456123&#x27;</span>.match(<span class="regexp">/123|456/</span>) <span class="comment">// [&#x27;456&#x27;]</span></span><br></pre></td></tr></table></figure>

<ul>
<li><h3 style="color: red">reg 是封装的函数</span>

</li>
</ul>
<figure class="highlight js"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br></pre></td><td class="code"><pre><span class="line"><span class="function"><span class="keyword">function</span> <span class="title">reg</span> (<span class="params">value, reg, type</span>) </span>&#123;</span><br><span class="line">    <span class="keyword">if</span> (type === <span class="string">&#x27;test&#x27;</span>) &#123;</span><br><span class="line">        <span class="keyword">return</span> reg.test(value)</span><br><span class="line">    &#125; <span class="keyword">else</span> &#123;</span><br><span class="line">        <span class="keyword">return</span> value.match(reg)</span><br><span class="line">    &#125;</span><br><span class="line">&#125;</span><br></pre></td></tr></table></figure>

<ul>
<li>[xyz]：字符集合。匹配所包含的任意一个字符</li>
</ul>
<figure class="highlight js"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br></pre></td><td class="code"><pre><span class="line">reg(<span class="string">&#x27;hello world&#x27;</span>,<span class="regexp">/[o]/</span>) <span class="comment">// [&#x27;o&#x27;]</span></span><br><span class="line">reg(<span class="string">&#x27;hello world&#x27;</span>,<span class="regexp">/[abcw]/</span>,<span class="string">&#x27;test&#x27;</span>) <span class="comment">// true &#x27;hello world&#x27; 包含了 w，所以结果为 true</span></span><br></pre></td></tr></table></figure>

<ul>
<li>[^xyz]：负值字符集合。匹配未包含的任意字符</li>
</ul>
<figure class="highlight js"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br></pre></td><td class="code"><pre><span class="line">reg(<span class="string">&#x27;hello world&#x27;</span>,<span class="regexp">/[^hello world]/</span>,<span class="string">&#x27;test&#x27;</span>) <span class="comment">// false</span></span><br><span class="line">reg(<span class="string">&#x27;hello world&#x27;</span>,<span class="regexp">/[^helloworld]/</span>,<span class="string">&#x27;test&#x27;</span>) <span class="comment">// true</span></span><br></pre></td></tr></table></figure>

<ul>
<li>[a-z]：字符范围。匹配指定范围内的任意字符</li>
</ul>
<figure class="highlight js"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">reg(<span class="string">&#x27;a1A&#x27;</span>,<span class="regexp">/[a-zA-Z\d]/</span>,<span class="string">&#x27;test&#x27;</span>) <span class="comment">// true</span></span><br></pre></td></tr></table></figure>

<ul>
<li>[^a-z]：负值字符范围。匹配任何不在指定范围内的任意字符</li>
</ul>
<figure class="highlight js"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">reg(<span class="string">&#x27;a1A*&#x27;</span>,<span class="regexp">/[^a-zA-Z\d]/</span>,<span class="string">&#x27;test&#x27;</span>) <span class="comment">// true</span></span><br></pre></td></tr></table></figure>

<ul>
<li>\b：匹配一个单词边界，也就是指单词和空格间的位置</li>
</ul>
<figure class="highlight js"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br></pre></td><td class="code"><pre><span class="line">reg(<span class="string">&#x27;hello world&#x27;</span>,<span class="regexp">/world\b/</span>,<span class="string">&#x27;test&#x27;</span>) <span class="comment">// true</span></span><br><span class="line">reg(<span class="string">&#x27;hello world&#x27;</span>,<span class="regexp">/worl\b/</span>,<span class="string">&#x27;test&#x27;</span>) <span class="comment">// false</span></span><br></pre></td></tr></table></figure>

<ul>
<li>\B：匹配非单词边界</li>
</ul>
<figure class="highlight js"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br></pre></td><td class="code"><pre><span class="line">reg(<span class="string">&#x27;hello world&#x27;</span>,<span class="regexp">/world\B/</span>,<span class="string">&#x27;test&#x27;</span>) <span class="comment">// false</span></span><br><span class="line">reg(<span class="string">&#x27;hello world&#x27;</span>,<span class="regexp">/worl\B/</span>,<span class="string">&#x27;test&#x27;</span>) <span class="comment">// true</span></span><br></pre></td></tr></table></figure>

<ul>
<li><p>\d：匹配一个数字字符。等价于[0-9]</p>
</li>
<li><p>\D：匹配一个非数字字符。等价于[^0-9]</p>
</li>
<li><p>\f：匹配一个换页符。等价于\x0c和\cL</p>
</li>
<li><p>\n：匹配一个换行符。等价于\x0a和\cJ</p>
</li>
<li><p>\r：    匹配一个回车符。等价于\x0d和\cM</p>
</li>
<li><p>\s：匹配任何空白字符，包括空格、制表符、换页符等等。等价于[ \f\n\r\t\v]</p>
</li>
<li><p>\S：匹配任何非空白字符。等价于[^ \f\n\r\t\v]</p>
</li>
<li><p>\t：匹配一个制表符。等价于\x09和\cI</p>
</li>
<li><p>\v：匹配一个垂直制表符。等价于\x0b和\cK</p>
</li>
<li><p>\w：匹配包括下划线的任何单词字符。等价于“[A-Za-z0-9_]”</p>
</li>
<li><p>\W：匹配任何非单词字符。等价于“[^A-Za-z0-9_</p>
</li>
<li><p>\xn：配n，其中n为十六进制转义值。十六进制转义值必须为确定的两个数字长。例如，“\x41”匹配“A”。“\x041”则等价于“\x04&amp;1”。正则表达式中可以使用ASCII编码</p>
</li>
<li><p>\num：匹配num，其中num是一个正整数。对所获取的匹配的引用。例如，“(.)\1”匹配两个连续的相同字符</p>
</li>
<li><p>\n：标识一个八进制转义值或一个向后引用。如果\n之前至少n个获取的子表达式，则n为向后引用。否则，如果n为八进制数字（0-7），则n为一个八进制转义值</p>
</li>
<li><p>\nm：标识一个八进制转义值或一个向后引用。如果\nm之前至少有nm个获得子表达式，则nm为向后引用。如果\nm之前至少有n个获取，则n为一个后跟文字m的向后引用。如果前面的条件都不满足，若n和m均为八进制数字（0-7），则\nm将匹配八进制转义值nm</p>
</li>
<li><p>\nml：如果n为八进制数字（0-3），且m和l均为八进制数字（0-7），则匹配八进制转义值nml</p>
</li>
<li><p>\un：匹配n，其中n是一个用四个十六进制数字表示的Unicode字符。例如，\u00A9匹配版权符号（©）</p>
</li>
</ul>
<h2 id="正则表达式的方法"><a href="#正则表达式的方法" class="headerlink" title="正则表达式的方法"></a>正则表达式的方法</h2><ul>
<li>exec：一个在字符串中执行查找匹配的RegExp方法，它返回一个数组（未匹配到则返回 null）</li>
<li>test：一个在字符串中测试是否匹配的RegExp方法，它返回 true 或 false</li>
<li>match：一个在字符串中执行查找匹配的String方法，它返回一个数组，在未匹配到时会返回 null</li>
<li>一个在字符串中执行查找所有匹配的String方法，它返回一个迭代器（iterator）</li>
<li>search：一个在字符串中测试匹配的String方法，它返回匹配到的位置索引，或者在失败时返回-1</li>
<li>replace：一个在字符串中执行查找匹配的String方法，并且使用替换字符串替换掉匹配到的子字符串</li>
<li>split：一个使用正则表达式或者一个固定字符串分隔一个字符串，并将分隔后的子字符串存储到数组中的 String 方法</li>
</ul>
<h2 id="通过标志进行高级搜索"><a href="#通过标志进行高级搜索" class="headerlink" title="通过标志进行高级搜索"></a>通过标志进行高级搜索</h2><ul>
<li>g：全局搜索(默认是只匹配1次，如：’123456’.match(/[1-9]/)，结果是[1]，加上 g 就会全局匹配：’123456’.match(/[1-9]+/g)，结果是[‘1’, ‘2’, ‘3’, ‘4’, ‘5’, ‘6’])</li>
<li>i：不区分大小写</li>
<li>m：多行搜索</li>
<li>s：允许 . 匹配换行符</li>
<li>u：使用unicode码的模式进行匹配</li>
<li>y：执行“粘性(sticky)”搜索,匹配从目标字符串的当前位置开始</li>
</ul>
<h2 id="字符组合：两种模式：贪婪模式，尽可能多的执行；惰性模式，尽可能少的执行"><a href="#字符组合：两种模式：贪婪模式，尽可能多的执行；惰性模式，尽可能少的执行" class="headerlink" title="字符组合：两种模式：贪婪模式，尽可能多的执行；惰性模式，尽可能少的执行"></a>字符组合：两种模式：贪婪模式，尽可能多的执行；惰性模式，尽可能少的执行</h2><ul>
<li><p>.*：贪婪模式，尽可能多的执行（从开始匹配一直到匹配结束）</p>
</li>
<li><p>*?：惰性模式，执行 0 次</p>
</li>
<li><p>+?：惰性模式，只执行 1 次</p>
</li>
<li><p>.*?：惰性模式，只匹配一个</p>
</li>
<li><p>.+?：惰性模式，从指定字符开始，匹配两次：1212345678’.match(/2.+?/) ，结果 [21]</p>
</li>
<li><p>??：惰性模式，执行 1 次</p>
</li>
</ul>
<h2 id="正则表达式收集"><a href="#正则表达式收集" class="headerlink" title="正则表达式收集"></a>正则表达式收集</h2><ul>
<li><p><span style="color: red">将表达式放于()中，即代表分组，组的作用是将他们用为一个整体来使用正则操作</span></p>
</li>
<li><p>提取字符串中标签的内容</p>
</li>
</ul>
<figure class="highlight js"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br><span class="line">12</span><br><span class="line">13</span><br><span class="line">14</span><br><span class="line">15</span><br><span class="line">16</span><br><span class="line">17</span><br><span class="line">18</span><br><span class="line">19</span><br><span class="line">20</span><br><span class="line">21</span><br><span class="line">22</span><br><span class="line">23</span><br><span class="line">24</span><br><span class="line">25</span><br><span class="line">26</span><br><span class="line">27</span><br><span class="line">28</span><br><span class="line">29</span><br><span class="line">30</span><br><span class="line">31</span><br><span class="line">32</span><br></pre></td><td class="code"><pre><span class="line"><span class="comment">// 例子：查看字符串中是否包含span标签，并将span标签的内容提取出来</span></span><br><span class="line"><span class="keyword">const</span> reg = <span class="regexp">/(?&lt;=\&lt;span\&gt;).*?(?=\&lt;\/span&gt;)/</span></span><br><span class="line"><span class="keyword">const</span> str = <span class="string">&#x27;测试&lt;span&gt;https://baidu.com&lt;/span&gt;正则&#x27;</span></span><br><span class="line"></span><br><span class="line"><span class="keyword">const</span> result = str.match(reg)</span><br><span class="line"><span class="built_in">console</span>.log(<span class="string">&quot;结果是&quot;</span>, result) <span class="comment">// [&quot;https://baidu.com&quot;]</span></span><br><span class="line"></span><br><span class="line"><span class="comment">/*</span></span><br><span class="line"><span class="comment">讲解：</span></span><br><span class="line"><span class="comment">1、(?&lt;=pattern): 匹配(?&lt;=\&lt;span\&gt;)后面的字符</span></span><br><span class="line"><span class="comment">   (?=pattern)：匹配(?=\&lt;\/span&gt;)前面的字符</span></span><br><span class="line"><span class="comment">   .*：从(?&lt;=\&lt;span\&gt;)开始匹配，直到最后一个匹配结束，会匹配多次</span></span><br><span class="line"><span class="comment">   .*?：* 或者 + 等后面加 ?,即代表懒惰匹配，也就是匹配到第一个就结束了，即：&lt;span&gt;https://baidu.com</span></span><br><span class="line"><span class="comment">   </span></span><br><span class="line"><span class="comment">2、总体意思是：匹配&lt;span&gt;&lt;/span&gt;之间的内容，并且只匹配一次</span></span><br><span class="line"><span class="comment"></span></span><br><span class="line"><span class="comment">3、匹配到的结果是Matches集合，也就是Matches数组：</span></span><br><span class="line"><span class="comment">[</span></span><br><span class="line"><span class="comment">    &quot;https://baidu.com&quot;,</span></span><br><span class="line"><span class="comment">    groups: undefined,input,</span></span><br><span class="line"><span class="comment">    index: 8,</span></span><br><span class="line"><span class="comment">    input: &#x27;测试&lt;span&gt;https://baidu.com&lt;/span&gt;正则&#x27;,</span></span><br><span class="line"><span class="comment">    length: 1    </span></span><br><span class="line"><span class="comment">]</span></span><br><span class="line"><span class="comment"></span></span><br><span class="line"><span class="comment"></span></span><br><span class="line"><span class="comment">4、但是最终打印出来的结果就是一个普通的数组：[&quot;https://baidu.com&quot;]</span></span><br><span class="line"><span class="comment"></span></span><br><span class="line"><span class="comment">总结：就是将括号中的内容转换成数组输出</span></span><br><span class="line"><span class="comment"></span></span><br><span class="line"><span class="comment"></span></span><br><span class="line"><span class="comment">*/</span></span><br></pre></td></tr></table></figure>

<ul>
<li>用户名：<code>/^[a-z0-9_-]&#123;3,16&#125;$/</code></li>
<li>密码：<code>    /^[a-z0-9_-]&#123;6,18&#125;$/</code></li>
<li>十六进制：<code>/^#?([a-f0-9]&#123;6&#125;|[a-f0-9]&#123;3&#125;)$/</code></li>
<li>电子邮箱：</li>
</ul>
<figure class="highlight plain"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br></pre></td><td class="code"><pre><span class="line">&#x2F;^([a-z0-9_\.-]+)@([\da-z\.-]+)\.([a-z\.]&#123;2,6&#125;)$&#x2F;</span><br><span class="line">&#x2F;^[a-z\d]+(\.[a-z\d]+)*@([\da-z](-[\da-z])?)+(\.&#123;1,2&#125;[a-z]+)+$&#x2F; </span><br></pre></td></tr></table></figure>
<ul>
<li>URL：    <code>/^(https?:\/\/)?([\da-z\.-]+)\.([a-z\.]&#123;2,6&#125;)([\/\w \.-]*)*\/?$/</code></li>
<li>IP 地址：<figure class="highlight plain"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br></pre></td><td class="code"><pre><span class="line">&#x2F;((2[0-4]\d|25[0-5]|[01]?\d\d?)\.)&#123;3&#125;(2[0-4]\d|25[0-5]|[01]?\d\d?)&#x2F;</span><br><span class="line">&#x2F;^(?:(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)\.)&#123;3&#125;(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)$&#x2F; </span><br></pre></td></tr></table></figure></li>
<li>HTML标签：<code>/^&lt;([a-z]+)([^&lt;]+)*(?:&gt;(.*)&lt;\/\1&gt;|\s+\/&gt;)$/</code></li>
<li>删除代码或者\注释：<code>(?&lt;!http:|\S)//.*$</code></li>
<li>Unicode编码中的汉字范围：<code>/^[\u2E80-\u9FFF]+$/</code></li>
<li>只能输入数字：<code>/[0-9]+/g</code></li>
<li>零和非零开头的数字：<code>^(0|[1-9][0-9]*)$</code> </li>
<li>非零开头的最多带两位小数的数字: <figure class="highlight js"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br><span class="line">12</span><br></pre></td><td class="code"><pre><span class="line">/^([<span class="number">1</span>-<span class="number">9</span>][<span class="number">0</span>-<span class="number">9</span>]*)+(\.[<span class="number">0</span>-<span class="number">9</span>]&#123;<span class="number">1</span>,<span class="number">2</span>&#125;)?$/  </span><br><span class="line"></span><br><span class="line">解析：</span><br><span class="line">([<span class="number">1</span>-<span class="number">9</span>][<span class="number">0</span>-<span class="number">9</span>]*)：分组执行正则表达式</span><br><span class="line">[<span class="number">1</span>-<span class="number">9</span>]：匹配<span class="number">1</span>-<span class="number">9</span>的任意数字，没加任意匹配多次的字符（*，+），默认只会匹配一次</span><br><span class="line">[<span class="number">0</span>-<span class="number">9</span>]*：匹配多个<span class="number">0</span>-<span class="number">9</span>的数字</span><br><span class="line">^([<span class="number">1</span>-<span class="number">9</span>][<span class="number">0</span>-<span class="number">9</span>]*)：合起来的意思就是：以非<span class="number">0</span>数字开头，并有多个<span class="number">0</span>-<span class="number">9</span>的数字，如：<span class="number">1009</span>，<span class="number">9038</span> 等等</span><br><span class="line">\.：匹配 .</span><br><span class="line">[<span class="number">0</span>-<span class="number">9</span>]&#123;<span class="number">1</span>,<span class="number">2</span>&#125;：<span class="number">0</span>-<span class="number">9</span>的数字<span class="number">1</span>位或者<span class="number">2</span>位</span><br><span class="line">(\.[<span class="number">0</span>-<span class="number">9</span>]&#123;<span class="number">1</span>,<span class="number">2</span>&#125;)：匹配小数点和<span class="number">1</span>位或者<span class="number">2</span>位数字</span><br><span class="line">+，？：目前理解是等价于: +? 即惰性执行，即只匹配一次</span><br><span class="line">/^([<span class="number">1</span>-<span class="number">9</span>][<span class="number">0</span>-<span class="number">9</span>]*)+(\.[<span class="number">0</span>-<span class="number">9</span>]&#123;<span class="number">1</span>,<span class="number">2</span>&#125;)?$/：合起来就是：非<span class="number">0</span>开头最多带两位小数的数字</span><br></pre></td></tr></table></figure>

</li>
</ul>
<h2 id="常用表达式和测试工具可查看：https-c-runoob-com-front-end-854"><a href="#常用表达式和测试工具可查看：https-c-runoob-com-front-end-854" class="headerlink" title="常用表达式和测试工具可查看：https://c.runoob.com/front-end/854/"></a>常用表达式和测试工具可查看：<a target="_blank" rel="noopener" href="https://c.runoob.com/front-end/854/">https://c.runoob.com/front-end/854/</a></h2>
      
    </div>
    <div class="article-footer">
      <!-- <blockquote class="mt-2x"> -->
  <!-- <ul class="post-copyright list-unstyled">
    
    <li class="post-copyright-link hidden-xs">
      <strong>本文链接：</strong>
      <a href="https://gitee.com/Yu-Luoboke/2021/11/26/%E6%AD%A3%E5%88%99%E8%A1%A8%E8%BE%BE%E5%BC%8F%E5%BD%92%E7%BA%B3/" title="正则表达式归纳" target="_blank" rel="external">https://gitee.com/Yu-Luoboke/2021/11/26/%E6%AD%A3%E5%88%99%E8%A1%A8%E8%BE%BE%E5%BC%8F%E5%BD%92%E7%BA%B3/</a>
    </li>
    
    <li class="post-copyright-license">
      <strong>版权声明： </strong> 本博客所有文章除特别声明外，均采用 <a href="http://creativecommons.org/licenses/by/4.0/deed.zh" target="_blank" rel="external">CC BY 4.0 CN协议</a> 许可协议。转载请注明出处！
    </li>
  </ul> -->
<!-- </blockquote> -->


<!-- <div class="panel panel-default panel-badger">
  <div class="panel-body">
    <figure class="media">
      <div class="media-left">
        <a href="http://yu-luoboke.gitee.io/blog" target="_blank" class="img-burn thumb-sm visible-lg">
          <img src="/blog/images/avatar.jpg" class="img-rounded w-full" alt="">
        </a>
      </div>
      <div class="media-body">
        <h3 class="media-heading"><a href="http://yu-luoboke.gitee.io/blog" target="_blank"><span class="text-dark">雨落</span><small class="ml-1x">前端开发-奋斗青年</small></a></h3>
        <div>前端经验总结。</div>
      </div>
    </figure>
  </div>
</div> -->


    </div>
  </article>
  
    

  
</div>

  <nav class="bar bar-footer clearfix" data-stick-bottom>
  <div class="bar-inner">
  
  <ul class="pager pull-left">
    
    <li class="prev">
      <a href="/blog/2021/12/03/%E8%87%AA%E5%AE%9A%E4%B9%89%E8%A1%A8%E6%83%85%E5%8C%85/" title="自定义表情包"><i class="icon icon-angle-left" aria-hidden="true"></i><span>&nbsp;&nbsp;上一篇</span></a>
    </li>
    
    
    <li class="next">
      <a href="/blog/2021/11/15/crypto-js-aes-%E5%8A%A0%E8%A7%A3%E5%AF%86/" title="crypto-js-aes-加解密"><span>下一篇&nbsp;&nbsp;</span><i class="icon icon-angle-right" aria-hidden="true"></i></a>
    </li>
    
    
  </ul>
  
  
  
  <div class="bar-right">
    
  </div>
  </div>
</nav>
  


</main>

  <footer class="footer" itemscope itemtype="http://schema.org/WPFooter">
	
	
    <ul class="social-links">
    	
        <li><a href="http://yu-luoboke.gitee.io/blog" target="_blank" title="Github" ><i class="icon icon-github"></i></a></li>
        
    </ul>

    <div class="copyright">
    	
        &copy; 2024 lianghongming
        
        <div class="publishby">
        	Theme by <a href="https://gitee.com/Yu-Luoboke/blog" target="_blank"> blog </a>base on <a href="https://gitee.com/Yu-Luoboke/blog" target="_blank">pure</a>.
        </div>
    </div>
</footer>
  <script src="//cdn.jsdelivr.net/npm/jquery@1.12.4/dist/jquery.min.js"></script>
<script>
window.jQuery || document.write('<script src="js/jquery.min.js"><\/script>')
</script>

<script src="/blog/js/plugin.min.js"></script>


<script src="/blog/js/application.js"></script>


    <script>
(function (window) {
    var INSIGHT_CONFIG = {
        TRANSLATION: {
            POSTS: '文章',
            PAGES: '页面',
            CATEGORIES: '分类',
            TAGS: '标签',
            UNTITLED: '(未命名)',
        },
        ROOT_URL: '/blog/',
        CONTENT_URL: '/blog/content.json',
    };
    window.INSIGHT_CONFIG = INSIGHT_CONFIG;
})(window);
</script>

<script src="/blog/js/insight.js"></script>






   









</body>
</html>